<template>
<canvas id="joystick" width="200" height="200"></canvas>
</template>

<script lang="ts" setup>
import { onMounted, onBeforeUnmount } from 'vue'
import Joystick from './CJoystick'
let joystick = null
onMounted(() => {
    joystick = new Joystick({
        container: 'joystick',
    })
})
onBeforeUnmount(()=>{
    joystick = null
})
</script>

<style lang="scss" scoped>
.joystick-box {
  position: absolute;
  width: 100%;
  bottom: 40px;
}
</style>